/* ==============================================================
    Main stylesheet
   --------------------------------------------------------------
    Starting CSS that provides a modern HTML-5 ready alternative
    to CSS resets, by making browsers render all elements more
    consistently and in line with modern standards.
    Also includes user custom styles defined in custom.less.
   --------------------------------------------------------------
    Author : Yohann CALLEA
    Last update : 20/09/2012
   --------------------------------------------------------------
    Greatly inspired by HTML5 ✰ Boilerplates work on cross-browser
    styling (h5bp.com/css).
   ============================================================== */


/* --------------------------------------------------------------
    HTML5 display definitions
   -------------------------------------------------------------- */

  article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
      display: block;
  }
  
  audio, canvas, video {
      display: inline-block;
      *display: inline;
      *zoom: 1;
  }
  
  audio:not([controls]) {
      display: none;
  }
  
  [hidden] {
      display: none;
  }



/* --------------------------------------------------------------
    Base
   --------------------------------------------------------------
    Correct text resizing oddly in IE6/7 when body font-size
    is set using em units and prevent iOS text size adjust on
    device orientation change, without disabling user zoom.
   -------------------------------------------------------------- */

  html {
      font-size: 100%;
      -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
  }
  
  body {
      margin: 0;
      font-size: 13px;
      line-height: 1.231;
  }
  
  body, button, input, select, textarea {
      font-family: sans-serif;
      color: #222;
  }



/* --------------------------------------------------------------
    Links
   -------------------------------------------------------------- */

  a {
      color: #00E;
      
      &:visited {
          color: #551A8B;
      }
      
      &:hover {
          color: #06E;
      }
      
      &:focus {
          outline: thin dotted;
      }
      
      &:hover, &:active {
          outline: 0;
      }
  }



/* --------------------------------------------------------------
    Typography
   -------------------------------------------------------------- */

  abbr[title] {
      border-bottom: 1px dotted;
  }
  
  b, strong {
      font-weight: bold;
  }
  
  blockquote {
      margin: 1em 40px;
  }
  
  dfn {
      font-style: italic;
  }
  
  hr {
      display: block;
      height: 1px;
      border: 0;
      border-top: 1px solid #CCC;
      margin: 1em 0;
      padding: 0;
  }
  
  ins {
      background: #FF9;
      color: #000;
      text-decoration: none;
  }
  
  mark {
      background: #FF0;
      color: #000;
      font-style: italic;
      font-weight: bold;
  }
  
  pre, code, kbd, samp {
      font-family: monospace, serif;
      _font-family: 'courier new', monospace;
      font-size: 1em;
  }
  
  pre {
      white-space: pre;
      white-space: pre-wrap;
      word-wrap: break-word;
  }
  
  q {
      quotes: none;
  
      &:before, &:after {
          content: "";
          content: none;
      }
  }
  
  small {
      font-size: 85%;
  }
  
  sub, sup {
      font-size: 75%;
      line-height: 0;
      position: relative;
      vertical-align: baseline;
  }
  
  sup {
      top: -0.5em;
  }
  
  sub {
      bottom: -0.25em;
  }



/* --------------------------------------------------------------
    Lists
   -------------------------------------------------------------- */

  ul, ol {
      margin: 1em 0;
      padding: 0 0 0 40px;
  }
  
  dd {
      margin: 0 0 0 40px;
  }
  
  nav ul, nav ol {
      list-style: none;
      list-style-image: none;
      margin: 0;
      padding: 0;
  }



/* --------------------------------------------------------------
    Embedded content
   --------------------------------------------------------------
    Improve image quality when scaled in IE7.
    Remove the gap between images and borders on image containers.
    Correct overflow not hidden in IE9.
   -------------------------------------------------------------- */
  
  img {
      border: 0;
      -ms-interpolation-mode: bicubic;
      vertical-align: middle;
  }
  
  svg:not(:root) {
      overflow: hidden;
  }



/* --------------------------------------------------------------
    Figures
   -------------------------------------------------------------- */

  figure {
      margin: 0;
  }



/* --------------------------------------------------------------
    Forms
   -------------------------------------------------------------- */

  form {
      margin: 0;
  }
  
  fieldset {
      border: 0;
      margin: 0;
      padding: 0;
  }
  
  label {
      cursor: pointer;
  }
  
  legend {
      border: 0;
      *margin-left: -7px;
      padding: 0;
  }
  
  button, input, select, textarea {
      font-size: 100%;
      margin: 0;
      vertical-align: baseline;
      *vertical-align: middle;
  }
  
  button, input {
      line-height: normal;
      *overflow: visible;
  }
  
  table button, table input {
      *overflow: auto;
  }
  
  button, input[type="button"], input[type="reset"], input[type="submit"], [role="button"] {
      cursor: pointer;
      -webkit-appearance: button;
  }
  
  input[type="checkbox"], input[type="radio"] {
      box-sizing: border-box;
      padding: 0;
  }
  
  input[type="search"] {
      -webkit-appearance: textfield;
      -moz-box-sizing: content-box;
      -webkit-box-sizing: content-box;
      box-sizing: content-box;
      
      &::-webkit-search-decoration {
          -webkit-appearance: none;
      }
  }
  
  button::-moz-focus-inner {
      border: 0;
      padding: 0;
  }
  
  textarea {
      overflow: auto;
      vertical-align: top;
      resize: vertical;
  }
  
  input:valid, textarea:valid {
    
  }
  
  input:invalid, textarea:invalid {
      background-color: #F0DDDD;
  }



/* --------------------------------------------------------------
    Tables
   -------------------------------------------------------------- */

  table {
      border-collapse: collapse;
      border-spacing: 0;
  }
  
  td {
      vertical-align: top;
  }


   
/* --------------------------------------------------------------
    Custom styles
   -------------------------------------------------------------- */

  @import 'custom';


/* --------------------------------------------------------------
    Non-semantic helper classes
   --------------------------------------------------------------
    Do not add any custom style after this section.
   -------------------------------------------------------------- */

  /* Prevent callout */
  .nocallout {
      -webkit-touch-callout: none;
  }
  
  /* A hack for HTML5 contenteditable attribute on mobile */
  textarea[contenteditable] {
      -webkit-appearance: none;
  }
  
  /* A workaround for S60 3.x and 5.0 devices which do not animated gif images if they have been set as display: none */
  .gifhidden {
      position: absolute;
      left: -100%;
  }
  
  /* For image replacement */
  .ir {
      display: block;
      border: 0;
      text-indent: -999em;
      overflow: hidden;
      background-color: transparent;
      background-repeat: no-repeat;
      text-align: left;
      direction: ltr;
      
      br {
          display: none;
      }
  }
  
  /* Hide from both screenreaders and browsers */
  .hidden {
      display: none !important;
      visibility: hidden;
  }
  
  /* Hide only visually, but have it available for screenreaders */
  .visuallyhidden {
      border: 0;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px;
      
      .focusable:active, .focusable:focus {
          clip: auto;
          height: auto;
          margin: 0;
          overflow: visible;
          position: static;
          width: auto;
      }
  }
    
  /* Hide visually and from screenreaders, but maintain layout */
  .invisible {
      visibility: hidden;
  }
  
  .pointer {
      cursor: pointer;
  }

  /* Contain floats */
  .clearfix {
      *zoom: 1;
      
      &:before, &:after {
          content: "";
          display: table;
      }
      
      &:after {
          clear: both;
      }
  }



/* --------------------------------------------------------------
    Print styles
   --------------------------------------------------------------
    Strip all background colors, change the font color to black
    and remove text-shadow.
    
    Anchors are underlined and their colors removed.
    
    Anchors and Abbreviations are expanded to indicate where
    users reading the printed page can refer to, but  link text
    for image replaced elements are not displayed.
   -------------------------------------------------------------- */

  @media print {
      * {
          background: transparent !important;
          color: black !important;
          text-shadow: none !important;
          filter:none !important;
          -ms-filter: none !important;
      }
      
      a, a:visited {
          text-decoration: underline;
      }
      
      a[href]:after {
          content: " (" attr(href) ")";
      }
      
      abbr[title]:after {
          content: " (" attr(title) ")";
      }
      
      .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
          content: "";
      }
      
      pre, blockquote {
          border: 1px solid #999;
          page-break-inside: avoid;
      }
      
      thead {
          display: table-header-group;
      }
      
      tr, img {
          page-break-inside: avoid;
      }
      
      img {
          max-width: 100% !important;
      }
      
      @page {
          margin: 0.5cm;
      }
      
      p, h2, h3 {
          orphans: 3;
          widows: 3;
      }
      
      h2, h3 {
          page-break-after: avoid;
      }
      
  }